<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>管理员登录 - 局域网通讯系统</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
    <link rel="stylesheet" href="/css/login.css">
    <link rel="icon" type="image/png" href="/Image/logo.png">
</head>
<body>
    <div class="login-bg">
        <div class="container d-flex justify-content-center align-items-center min-vh-100">
            <div class="login-card shadow-lg p-4 rounded-4 bg-white">
                <div class="text-center mb-4">
                    <img src="/Image/logo.png" alt="Logo" class="mb-2" style="height:48px;">
                    <h2 class="fw-bold mb-1">管理员登录</h2>
                    <div class="text-secondary small">LAN Communication System</div>
                </div>
                <form action="/admin/login" method="post" autocomplete="off">
                    <div th:if="${errorMsg}" class="alert alert-danger py-2 mb-3" th:text="${errorMsg}"></div>
                    <div class="mb-3 position-relative">
                        <span class="input-icon"><i class="fa fa-user"></i></span>
                        <input type="text" name="username" id="adminUsername" class="form-control ps-5" placeholder="管理员账号" required autofocus>
                    </div>
                    <div class="mb-3 position-relative">
                        <span class="input-icon"><i class="fa fa-lock"></i></span>
                        <input type="password" name="password" id="adminPassword" class="form-control ps-5" placeholder="密码" required>
                    </div>
                    <button class="btn btn-primary w-100 py-2 fw-bold" type="submit">登录</button>
                    <div class="login-links text-center mt-3">
                        <a href="/login">返回用户登录</a>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
    <script src="/js/jquery-1.12.3.min.js"></script>
    <script>
      $(function() {
        $('form').on('submit', function(e) {
          var username = $('#adminUsername').val().trim();
          var password = $('#adminPassword').val().trim();
          $('.alert-danger').remove();
          if (!username) {
            $(this).prepend('<div class="alert alert-danger py-2 mb-3">账号不能为空</div>');
            $('#adminUsername').focus();
            e.preventDefault();
            return false;
          }
          if (!password) {
            $(this).prepend('<div class="alert alert-danger py-2 mb-3">密码不能为空</div>');
            $('#adminPassword').focus();
            e.preventDefault();
            return false;
          }
        });
      });
    </script>
</body>
</html> 